<!-- Horizontal Form -->
<div id="page-wrapper">
 <div class="box box-info">
      <div class="box-header with-border">
        <h3 class="box-title">添加学生</h3>
      </div>
      <!-- /.box-header -->
      <!-- form start -->
      <form class="form-horizontal">
        <div class="box-body">
          
          <div class="form-group">
            <label for="nameId" class="col-sm-2 control-label">学生姓名</label>
            <div class="col-sm-10">
              <input type="text" class="form-control"  id="studentName" placeholder="">
            </div>
          </div>
           <div class="form-group">
			<label for="permissionId" class="col-sm-2 control-label">用户名</label>
			<div class="col-sm-10">
              <input type="text" class="form-control"  id="username" placeholder="请输入用户名">
            </div>
		  </div>	  
           <div class="form-group">
            <label for="nameId" class="col-sm-2 control-label">访问权限</label>
            <div class="col-sm-10 typeRadio">
              	<label class="radio-inline">
				<input type="radio" name="valid" value="1" checked> 启用 </label>
				<label class="radio-inline">
				<input type="radio" name="valid" value="0"> 禁用</label>
            </div>
         </div>  
        </div>
        <!-- /.box-body -->
        <div class="box-footer">
          <button type="button" class="btn btn-default btn-cancel">Cancel</button>
          <button type="button" class="btn btn-info pull-right btn-valid">Save</button>
        </div>
        <!-- /.box-footer -->
      </form>
  </div>
</div>
  <!-- <script type="text/javascript" src="bower_components/ztree/jquery.ztree.all.min.js"></script>
  <script type="text/javascript" src="bower_components/layer/layer.js">
  </script> -->
  <script type="text/javascript">
  
  $(function(){
	  //box-footer中按钮事件注册 
	  $(".box-footer")
	  .on("click",".btn-cancel",doCancel)
	  .on("click",".btn-valid",doValid)  
	  //获取mainContentId上值
	  var rowData=
	  $("#mainContentId").data("rowData");
	  //假如有值说明是修改,则基于此值初始化编辑页面.
	  if(rowData)doInitEditFormData(rowData);
  });
  //初始化表单数据
  function doInitEditFormData(rowData){
    $("input[value="+rowData.valid+"]").prop("checked",true);
	$("#studentName").val(rowData.studentName);  
	$("#username").val(rowData.username);  
  }
  //回到列表页面
  function doCancel(){
	var url="student/student_list";
	$("#mainContentId").load(url);  
  }
   //将表单数据发送到服务端
  function doValid(){
	  //debugger
	 //1.获取表单中用户输入数据
	 var params=doGetEditFormData();
	  //alert($("input[name='valid']:checked").val())
	 var rowData=$("#mainContentId").data("rowData");
	 if(rowData)params.id=rowData.id;
	 var valid=params.valid;
	// valid=valid==1?"启用":"禁用";
	 valid=valid==1?1:0;
	// alert(valid);
	 //2.异步提交数据到服务端
	 var updateUrl="student/doValidById";
	 var url=updateUrl; 
	 $.post(url,params,function(result){
		 if(result.state==1){
			 alert(result.message); 
			 doEditRow(valid?1:0);
			 doCancel();
		 }else{
			 alert(result.message);
		 }
	 })
  }
  function doEditRow(valid){
	   //2.修改tr中第5个td中的内容(查询API文档)
	   var tr=$("tbody input[type='radio']:checked").parents("tr");
	   tr.find("td:eq(5)").text(valid?"禁用":"启用");
	   //3.获取当前行tr对象，然后重新绑定新的值
	   var rowData=tr.data("rowData")
	   valid=valid?0:1;
	   tr.data("rowData",rowData);
  } 
  
  //获取修改的学生参数
  function doGetEditFormData(){
	  var params={	
	     "studentName":$("#studentName").val(),
	     "valid":$("input[name='valid']:checked").val(),	  
	     "username":$("#username").val()
	  }
	  return params;
  }
 </script>
    
    
    
    
    
    
    
    
    